/*预约会议首页开始*/
.confrenceContainer {
	width: 100%;
	height: 100%;
	.disTime {
		border: 1px solid #777 !important;
		background: #777;
		color: #fff !important;
	}
	.actTime {
		border: 1px solid $color !important;
		background: $color;
		color: #fff !important;
	}
	.searchCont {
		width: 100%;
		padding: 30rpx;
		box-sizing: border-box;
		.borInput {
			width: 48%;
			border: 1px solid #ccc;
			height: 60rpx;

			border-radius: 10rpx;
			padding: 0 20rpx;
			box-sizing: border-box;
		}
	}
	.roomCont {
		// width: 100%;
		padding-left: 30rpx;
		box-sizing: border-box;
		flex-wrap: nowrap;
		overflow-x: auto;
		.room {
			border: 1px solid #ccc;
			height: 60rpx;
			padding: 0 30rpx;
			border-radius: 30rpx;
			margin-right: 30rpx;
			flex-shrink: 0;
		}
	}
	.canlnder {
		// position: fixed;
		// top: 290rpx;
	}
	.confrenceContent {
		width: 100%;
		height: calc(100% - 430rpx);
		// border: 1px solid #f00;
		background: #f0f0f0;
		padding: 30rpx;
		box-sizing: border-box;
		overflow: auto;
		.cont {
			width: 100%;
			margin-bottom: 30rpx;
			background: #fff;
			border-radius: 10rpx;
			padding: 30rpx;
			box-sizing: border-box;
			.top {
				width: 100%;
				margin-bottom: 20rpx;
				.left {
					width: 200rpx;
					height: 200rpx;
					margin-right: 30rpx;
					image {
						width: 100%;
						height: 100%;
					}
				}
				.title {
					font-size: 28rpx;
					color: #888;
					margin-bottom: 15rpx;
					.small {
						font-size: 36rpx;
						font-weight: bold;
						color: #333;
					}
					.lc {
						font-weight: bold;
						color: $color3;
					}
				}
				.rom {
					font-size: 32rpx;
					font-weight: bold;
					color: #333;
					margin-bottom: 15rpx;
				}
			}

			.bottom {
				width: 100%;
				flex-wrap: wrap;
				.timecont:nth-child(3n + 3) {
					margin-right: 0;
				}
				.timecont {
					border: 1px solid #ccc;
					color: #ccc;
					width: 180rpx;
					height: 100rpx;
					border-radius: 10rpx;
					margin-bottom: 30rpx;
					margin-right: 45rpx;
				}
				.noborder {
					border: none;
				}
			}
		}
	}
}
/*预约会议首页结束*/
/*预约会议步骤开始*/
.makeConferenceContainer {
	width: 100%;
	padding: 30rpx;
	box-sizing: border-box;
	.preStep {
		width: 30%;
		height: 60rpx;
		background: $color;
		color: #fff;
		border-radius: 15rpx;
	}
	.borderTop {
		border-top: 1px solid #eee;
	}
	.descCont {
		width: 100%;
		// padding: 0 30rpx;
		box-sizing: border-box;
		.cont {
			width: 100%;
			// box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.24);
			// border-radius: 10rpx;
		}
		.imgview {
			width: 100%;
			height: 300rpx;
			border-radius: 10rpx;
			margin-bottom: 30rpx;
			image {
				width: 100%;
				height: 100%;
			}
		}
		.title {
			font-size: 32rpx;
			padding-left: 20rpx;
			margin-bottom: 30rpx;
			width: 100%;
			height: 70rpx;
			line-height: 70rpx;
			background: #f0f0f0;
			color: #888;
		}
		.desc {
			color: #888;
			margin-bottom: 30rpx;
			.time {
				color: $color3;
			}
			.label {
				width: 140rpx;
				text-align: right;
			}
			.inputl {
				border: 1px solid #ccc;
				width: 100%;
				height: 60rpx;
				border-radius: 5rpx;
				padding-left: 10rpx;
				box-sizing: border-box;
			}
			.textl {
				width: 100%;
				height: 100rpx;
				border-radius: 5rpx;
				border: 1px solid #ccc;
				padding-left: 10rpx;
				box-sizing: border-box;
			}
		}
		.bigTitle {
			width: 100%;
			margin-bottom: 30rpx;
			text-align: center;
			.left {
				font-size: 32rpx;
				font-weight: bold;
				margin-right: 40rpx;
			}
			.right {
				font-size: 32rpx;
				color: $color3;
				font-weight: bold;
			}
		}
		.dateCont {
			width: 100%;
			padding: 0 30rpx;
			// padding: 30rpx 0;
			margin-bottom: 30rpx;
			.toDay {
				color: $color3;
				font-weight: bold;
			}
		}
		.disTime {
			border: 1px solid #777 !important;
			background: #777;
			color: #fff !important;
		}
		.actTime {
			border: 1px solid $color3 !important;
			background: $color3;
			color: #fff !important;
		}
		.bottom {
			width: 100%;
			flex-wrap: wrap;
			// margin-top: 60rpx;
			padding: 0 30rpx;
			border-bottom: 1px solid #eee;
			.timecont:nth-child(3n + 3) {
				margin-right: 0;
			}
			.timecont {
				border: 1px solid #ccc;
				color: #ccc;
				width: 180rpx;
				height: 100rpx;
				border-radius: 10rpx;
				margin-bottom: 30rpx;
				margin-right: 45rpx;
			}
			.noborder {
				border: none;
			}
		}
	}
	.bota {
		padding: 30rpx;
		box-sizing: border-box;
		.tip {
			color: #888;
			font-size: 32rpx;
			margin-bottom: 20rpx;
		}
		.bold1 {
			color: $color3;
		}
	}

	.steps {
		margin-bottom: 30px;
		counter-reset: step; /*创建步骤数字计数器*/
	}
	/*步骤描述*/

	.steps .stepsli {
		list-style-type: none;
		font-size: 12px;
		text-align: center;
		width: 33%;
		position: relative;
	}

	/*步骤数字*/
	.steps .stepsli:before {
		display: block;
		content: counter(step); /*设定计数器内容*/
		counter-increment: step; /*计数器值递增*/
		width: 32px;
		height: 32px;
		background-color: $color;
		line-height: 32px;
		border-radius: 32px;
		font-size: 16px;
		color: #fff;
		text-align: center;
		font-weight: 700;
		margin: 0 auto 8px auto;
		position: relative;
		z-index: 9;
	}

	/*连接线*/
	.steps .stepsli ~ .stepsli:after {
		content: '';
		width: 100%;
		height: 2px;
		background-color: $color;
		position: absolute;
		left: -50%;
		top: 15px;
		z-index: 0; /*放置在数字后面*/
	}

	/*将当前/完成步骤之前的数字及连接线变绿*/
	.steps .stepsli.active:before,
	.steps .stepsli.active:after {
		background-color: $color;
	}

	/*将当前/完成步骤之后的数字及连接线变灰*/
	.steps .stepsli.active ~ .stepsli:before,
	.steps .stepsli.active ~ .stepsli:after {
		background-color: #777;
	}
}

/*预约会议步骤结束*/
